---
import { getCollection, render } from "astro:content";
import DocsLayout from "../../layouts/DocsLayout.astro";

export async function getStaticPaths() {
  const posts = await getCollection("docs");
  return posts.map((post) => ({
    params: { slug: post.id == "index" ? undefined : post.id },
    props: { post }
  }));
}

const { data } = Astro.props.post;
const { Content } = await render(Astro.props.post);
---

<DocsLayout title={data.title}>
  <div class="prose max-w-full md:prose-lg">
    <Content />
  </div>
</DocsLayout>
